<template>
    <div>
        <com-heard></com-heard>
        <div class="cons">
            <div class="jx-top pu-con">
                <p
                    :class="topIndex == 0 ? 'jx-top-on' : ''"
                    @click="onTopTab(0)"
                >
                    了解{{ decData.title }}
                </p>
                <p>
                    <a
                        :href="prefixUrl + decData.coverFileUrl"
                        target="_blank"
                        style="width: 100%;height: 100%;display: inline-block;"
                        >资料下载(报名表)</a
                    >
                </p>
                <p
                    :class="topIndex == 2 ? 'jx-top-on' : ''"
                    @click="onTopTab(2)"
                >
                    获奖名单
                </p>
            </div>
            <div style="height:40px"></div>
            <div class="jx-con jx-1 pu-con" v-if="topIndex == 0">
                <div class="jx-12">
                    <div class="remark">
                        <h1>{{ decData.title }}</h1>
                        <div v-html="decData.content"></div>
                    </div>
                    <div></div>
                </div>
            </div>
            <div class="jx-con pu-con" v-if="topIndex == 2">
                <div class="jx-21">
                    <span>
                        <p>奖项</p>
                        <p>作品名称</p>
                        <p>获奖单位</p>
                        <p>获奖时间</p>
                    </span>
                    <div class="list" v-if="awardList.length > 0">
                        <span v-for="(item, index) in awardList" :key="index">
                            <p>{{ item.awardMenuLevel }}</p>
                            <p>{{ item.caseName }}</p>
                            <p>{{ item.awardName }}</p>
                            <p>{{ item.awardTime | pattime }}</p>
                        </span>
                    </div>
                    <div class="list" v-else>
                        <p>暂无数据</p>
                    </div>
                    <div class="news-page">
                        <el-pagination
                            background
                            layout="prev, pager, next"
                            :total="totalSum"
                            :page-size="sizeSum"
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                        ></el-pagination>
                    </div>
                </div>
            </div>
            <div style="height:40px"></div>
        </div>
        <com-foot></com-foot>
    </div>
</template>

<script>
import comHeard from "@/components/jsscom-heard";
import comFoot from "@/components/com-foot";
import _ from "underscore";
import moment from "moment";

export default {
    components: {
        comHeard,
        comFoot,
    },
    filters: {
        pattime(value) {
            return value.slice(0, 10);
        },
        angtime(value) {
            return moment(value).format("YYYY-MM-DD");
        },
    },
    data() {
        return {
            prefixUrl: "",
            topIndex: 0,
            leftIndex: 0,
            newslist: [],
            totalSum: 0,
            sizeSum: 10,
            decData: {},
            awardList: [],
            id: "",
            parId: "",
        };
    },
    created() {
        this.prefixUrl = this.$store.state.user.imgUrl;
        this.id = this.$route.query.id;
        this.parId = this.$route.query.parId;
        this.getSsglDes();
    },
    mounted() {},
    methods: {
        async getSsglDes() {
            var data = { id: this.id };
            const res = await this.$store.dispatch("news/getSsglDes", data);
            this.decData = res;
            this.getAwardMenuInfo(1);
            console.log(res);
        },
        async getAwardMenuInfo(curIndex) {
            const data = {
                menuType: this.prefixUrlparId,
                awardMenuType: this.id,
                currentPage: curIndex,
                pageSize: 10,
            };
            const res = await this.$store.dispatch(
                "access/getAwardMenuInfo",
                data
            );
            console.log(res);
            this.totalSum = res.totalCount;
            this.awardList = res.list;
        },
        onTopTab(index) {
            this.topIndex = index;
        },
        handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
        },
        handleCurrentChange(val) {
            this.getAwardMenuInfo(val);
        },
    },
};
</script>

<style scoped>
@import "./jxdec.css";
</style>
